<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>APP</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/common.css" />
    <style>
        #header{
            text-align: center;
        }
        #header h5{
            display: inline-block;
            color: #FFF;
            line-height: 48px;
            width: 100%;
            position: absolute;
            left: 0;
        }
        .btn_box{
            width: 52px;
            height: 48px;
            position: relative;
        }
        .btn_box img{
            width: 23px;
            position: absolute;
            left: 50%;
            top: 50%;
            -webkit-transform: translate(-50%,-50%);
                    transform: translate(-50%,-50%);
        }
        .btn_box.pull-left{
            background: url(../../res/img/webview_dividing.png) right center no-repeat;
            background-size: 1px 100%;
            position: relative;
            z-index: 1;
        }
        .btn_box.pull-left:active,.btn_box.pull-left.tap-active{
            background: #7F0000 url(../../res/img/webview_dividing.png) right center no-repeat;
            background-size: 1px 100%;
        }
    </style>
</head>
<body>
    <div id="wrap">
        <div id="header">
            <div class="btn_box pull-left" tapmode="tap-active" onclick="api.closeWin();">
                <img src="../../res/img/tmall_btn_bar_back.png" alt="">
            </div>
            <h5>类目导航</h5>
        </div>
        <div id="main"> 
            
        </div>

    </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript">
    apiready = function(){
        window.header = $api.byId('header');
        $api.fixStatusBar(header); 
        var headerPos = $api.offset(header);
        var main = $api.byId('main');
        var mainPos = $api.offset(main);
        api.openFrame({
            name: 'detailclassify-con',
            url: './detailclassify-con.html',
            rect: {
                x: 0,
                y: headerPos.h,
                w: 'auto',
                h: mainPos.h
            }
        });  
    }
</script>
</html>